import $ from 'jquery';

/**
 * 将网点显示在地图上
 * @param data 需要显示的网点数据
 */
export function showPointsToMap(data, layer, map) {
  layer.removeAllFeatures();

  var len = data ? data.length : 0;
  if (len === 0) {
    return;
  }
  var pois = [];
  for (var i = 0; i < len; i++) {
    var item = data[i];

    if (!item.smx || item.smx == 0) {
      continue;
    }

    var style = getStyle();
    var size = new SuperMap.Size(style.width, style.height);

    var geo_point = new SuperMap.Geometry.Point(item.smx, item.smy);
    var poi = new SuperMap.Feature.Vector(geo_point);
    poi.style = style;

    poi.attributes = item;
    poi.attributes.type = "point";
    pois.push(poi);
  }
  layer.addFeatures(pois);
}

export function getStyle() {
  return {
    externalGraphic: "src/css/imgs/points/green/diamond.svg",
    graphicWidth: 25,
    graphicHeight: 25
  }
}

export function getAddStyle() {
  return {
    externalGraphic: "src/css/imgs/points/red/default.svg",
    graphicWidth: 20,
    graphicHeight: 32
  }
}

export function select(feature, map) {
  var point = feature.attributes;
  point.lonlat = new SuperMap.LonLat(point.smx, point.smy);
  openAttrPopup(point, map);
  // map.panTo(point.lonlat);
}

export function openAttrPopup(point, map) {
  var h = '<div class="map-popup">';
  h += getAttrPopupHtml(point, false);
  h += '</div>';

  let popup = new SuperMap.Popup.FramedCloud("popup-near",
    point.lonlat,
    new SuperMap.Size(300, 70),
    h,
    null,
    false,
    null
  );
  popup.autoSize = true;
  popup.panMapIfOutOfView = true;
  popup.relativePosition = "tr";
  map.removeAllPopup();
  map.addPopup(popup);

  $('.popup-close').unbind("click").click(function () {
    map.removeAllPopup();
  });
}

/** 
 * 获取网点属性popup内容
 */
export function getAttrPopupHtml(marker, editable) {
  var me = marker;
  var h = '';
  h += '<div class="title">';
  h += '  <span class="name" data-key="name" title="' + me.name + '" option="popup-attr">' + me.name + '</span>';
  h += '  <a class="popup-close" title="关闭"></a>';
  if (editable) {
    h += '  <a class="popup-delete" title="删除网点"></a>';
    h += '  <a class="popup-edit" title="编辑网点"></a>';
  }
  h += '  </div>';
  h += '  <div class="content">';
  h += '    <div class="pictures">';
  h += '    <div class="photo none"></div>';
  h += '  </div>';
  h += '  <div class="attr">';
  h += '    <span class="label">网点名称：</span>';
  h += '    <span class="text" data-key="name" option="popup-attr">' + me.name + '</span>';
  h += '  </div>';
  h += '  <div class="attr">';
  h += '    <span class="label">网点地址：</span>';
  h += '    <span class="text" data-key="address" option="popup-attr">' + me.address + '</span>';
  h += '  </div>';
  h += '  </div>';
  return h;
}